import React, { useState } from "react";
import Slider from "react-slick";
import style from "./index.module.less";
import service1 from "@/style/imgs/homePage/service_1.0d187d9.png";

const Case = () => {
  const settings = {
    dots: true,
    infinite: true,
    speed: 500,
    slidesToShow: 2,
    slidesToScroll: 2,
  };
  const [caseList, setCaseList] = useState([
    {
      img: service1,
      name1: "Nature Communications",
      name2: "Twelve-month specific IgG response to SARS-CoV-2 receptor-binding domain among COVID-19 convalescent plasma donors in Wuhan",
      name3: "Cesheng Li, Ding Yu",
      name4: "中国医药集团 上海交通大学 医学 生物学"
    },
    {
      img: service1,
      name1: "Nature Communications",
      name2: "Twelve-month specific IgG response to SARS-CoV-2 receptor-binding domain among COVID-19 convalescent plasma donors in Wuhan",
      name3: "Cesheng Li, Ding Yu",
      name4: "中国医药集团 上海交通大学 医学 生物学"
    },
    {
      img: service1,
      name1: "Nature Communications",
      name2: "Twelve-month specific IgG response to SARS-CoV-2 receptor-binding domain among COVID-19 convalescent plasma donors in Wuhan",
      name3: "Cesheng Li, Ding Yu",
      name4: "中国医药集团 上海交通大学 医学 生物学"
    },
    {
      img: service1,
      name1: "Nature Communications",
      name2: "Twelve-month specific IgG response to SARS-CoV-2 receptor-binding domain among COVID-19 convalescent plasma donors in Wuhan",
      name3: "Cesheng Li, Ding Yu",
      name4: "中国医药集团 上海交通大学 医学 生物学"
    },
  ]);
  return <>
    <div className={style.case_body}>
      <div className={`h2 black ${style.h2}`}>发表案例</div>
      <div className={style.case_desic}>
        使用万方寰宇英文论文编辑服务后，论文逻辑会更加严谨，语言会变得更通顺清晰，从而大大提升发表概率。经过修改，大部分客户的文章都发表在国际知名期刊及会议上，在分享他们喜悦的同时，万方寰宇团队也感到莫大荣幸能够参与其中，为科学的进步做出自己力所能及的事情。成立至今，我们已经帮助众多科研人员克服论文中的语言及逻辑障碍，并协助他们成功发表。由万方寰宇修改过的英文学术论文大都被国际知名期刊接收，以下是成功发表的部分案例:
      </div>
      <Slider {...settings} arrows={false} className={style.case_banner}>
        {caseList.map((item: any, index: number) => {
          return <div className={style.slider_item} key={index}>
            <img src={item.img} alt="图片加载失败" />
            <div className={style.case_right}>
              <div>
                <div>期刊名称</div>
                <div>{item.name1}</div>
              </div>
              <div>
                <div>文章名称</div>
                <div>{item.name2}</div>
              </div>
              <div>
                <div>第一作者</div>
                <div>{item.name3}</div>
              </div>
              <div>
                <div>单位及领域</div>
                <div>{item.name4}</div>
              </div>
            </div>
          </div>
        })}
      </Slider>
    </div>
  </>
}

export default Case;